<template>
  <div class="bar">
    <div class="progress" :style="{ width: progress + '%' }"></div>
  </div>
</template>

<script>
import { defineComponent } from "vue";
export default defineComponent({
  name: "BarProgress",
  props: {
    progress: {
      type: Number,
      default: 0,
    },
  },
});
</script>

<style lang="scss" scoped>
.bar {
  height: 4px;
  background-color: #ffcf13;

  .progress {
    height: 100%;
    background-color: #fff;
  }
}
</style>
